<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">	
	<title>个人小屋</title>
	<link rel="shortcut icon" href="./images/title.png">
	<link rel="stylesheet" href="./css/index.css">
	<link rel="stylesheet" href="./font-awesome-4.7.0/css/font-awesome.min.css">
</head>
<body>
	<!-- 头部部分 -->
	<header><span class="large">杜丽</span>个人小屋</header>
	<!-- 导航栏部分 -->
	<div class="navigator">
		<nav>
			<!-- 网站logo -->
			<a class="logo" href="index.html" name="top"><img src="./images/logo2.png" alt="个人小屋"></a>
			<!-- 菜单栏 -->
			<div class="nav-bar">
				<ul>
					<li><a href="index.html">首页</a></li>
					<li><a href="./html/study-notes.html">学习笔记</a></li>
					<li><a href="./html/learn-platform.html">学习平台</a></li>
					<li><a href="./html/my-projects.html">个人项目</a></li>
					<li><a href="./html/video-audio.html">影音专区</a></li>
					<li><a href="./html/essay.html">心情随笔</a></li>
					<li><a href="./html/myPhoto.html">我的相册</a></li>
					<li><a href="./html/time-axis.html">时间轴</a></li>
					<li><a href="./html/about-me.html">关于我</a></li>
					<li><a href="./html/message-board.html">留言板</a></li>
				</ul>				
			</div>
			<!-- 搜索图标 -->
			<div class="search-icon">
				<i id="searchMe" class="fa fa-search" aria-hidden="true" title="click me"></i>
			</div>
			<!-- 返回顶部和底部按钮 -->
			<div class="pointer">
				<ul>
					<li><a href="#top" title="返回顶部">&and;</a></li>
					<li><a href="#bottom" title="返回底部">&or;</a></li>
				</ul>
			</div>
		</nav>
	</div>
	<!-- 内容主体部分 -->
	<div class="main">
		<div class="contain">
			<!-- 搜索框 -->
			<div class="search-bar" id="searchBar" style="display: none;">
				<form action="">
					<input type="text">
					<input type="button" value="搜索">
				</form>
			</div>
			<!-- 搜索框显示隐藏部分 -->
			<script>
				//获取元素
				var icon = document.getElementById("searchMe");
				var bar = document.getElementById("searchBar");
				var timer = null;
				var opacity = bar.style.opacity = 0;
				var i = 0;  //定时器关闭时间
				//某个元素的点击事件
				icon.onclick = function(){
					//显示与隐藏的判断
					if (bar.style.display=="none") {
						bar.style.display = "block";
						timer = setInterval(function(){
							opacity += 0.25;
							i += 0.25;
							//关闭定时器
							if (i>=1) {
								clearInterval(timer);
								i = 0;
							}		
							bar.style.opacity = opacity;			
						},400);
					}else{
						timer = setInterval(function(){
							opacity = opacity-0.25;
							i += 0.25;
							// alert(opacity+","+i+","+bar.style.display);
							bar.style.opacity = opacity;
							if(i>=1||opacity==0){
								bar.style.display = "none";
								clearInterval(timer);
								i = 0;
							}
						},400);
					}
				};
			</script>
			<!-- <script>
				$(document).ready(function() {
					$("#searchMe").click(function(){
						$("#searchBar").fadeToggle(2000);
					})
				});
			</script> -->
			<!-- 左侧内容区域 -->
			<div class="contain-left">
				<!-- 左侧轮播图 -->
				<div class="hide">
					<div class="box1-left">
						<span class="before">
							<a href="" title="前"><img src="./images/lun1.png" alt="轮播图前"></a>
						</span>
						<span class="after">
							<a href="" title="后"><img src="./images/lun2.png" alt="轮播图后"></a>
						</span>
						<span class="top">
							<a href="" title="上"><img src="./images/lun3.png" alt="轮播图上"></a>
						</span>
						<span class="bottom">
							<a href="" title="下"><img src="./images/li1.png" alt="轮播图下"></a>
						</span>
					</div>
				</div>
				<!-- 左侧文章内容列表 -->
				<div class="box2-left">
					<div class="box2-left-item">
						<div class="box2-left-item-img">
							<a href=""><img src="./images/li1.png" alt=""></a>
							<span>学习笔记</span>
						</div>
						<div class="box2-left-item-text">
							<p class="text-title">
								<a href="">深度学习实战教程(六)：长短时记忆网络(LSTM)</a>
								</p>
							<p class="text-article">在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。</p>
							<p class="tag">
								<span><i class="fa fa-circle" aria-hidden="true"></i></i> javascript</span>
								<span><i class="fa fa-clock-o" aria-hidden="true"></i> 2019-07-23 15:21</span>
								<span><i class="fa fa-eye" aria-hidden="true"></i> 1314浏览</span>
								<span><i class="fa fa-commenting-o" aria-hidden="true"></i> 520评论</span>
								<span><i class="fa fa-heart-o" aria-hidden="true"></i> 6喜欢</span><span class="read-all"><a href="">阅读全文</a></span></p>
						</div>
					</div>
				</div>
				<div class="box2-left">
					<div class="box2-left-item">
						<div class="box2-left-item-img">
							<a href=""><img src="./images/li1.png" alt=""></a>
							<span>学习笔记</span>
						</div>
						<div class="box2-left-item-text">
							<p class="text-title">
								<a href="">深度学习实战教程(六)：长短时记忆网络(LSTM)</a>
								</p>
							<p class="text-article">在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。</p>
							<p class="tag">
								<span><i class="fa fa-circle" aria-hidden="true"></i></i> javascript</span>
								<span><i class="fa fa-clock-o" aria-hidden="true"></i> 2019-07-23 15:21</span>
								<span><i class="fa fa-eye" aria-hidden="true"></i> 1314浏览</span>
								<span><i class="fa fa-commenting-o" aria-hidden="true"></i> 520评论</span>
								<span><i class="fa fa-heart-o" aria-hidden="true"></i> 6喜欢</span><span class="read-all"><a href="">阅读全文</a></span></p>
						</div>
					</div>
				</div>
				<div class="box2-left">
					<div class="box2-left-item">
						<div class="box2-left-item-img">
							<a href=""><img src="./images/li1.png" alt=""></a>
							<span>学习笔记</span>
						</div>
						<div class="box2-left-item-text">
							<p class="text-title">
								<a href="">深度学习实战教程(六)：长短时记忆网络(LSTM)</a>
								</p>
							<p class="text-article">在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。</p>
							<p class="tag">
								<span><i class="fa fa-circle" aria-hidden="true"></i></i> javascript</span>
								<span><i class="fa fa-clock-o" aria-hidden="true"></i> 2019-07-23 15:21</span>
								<span><i class="fa fa-eye" aria-hidden="true"></i> 1314浏览</span>
								<span><i class="fa fa-commenting-o" aria-hidden="true"></i> 520评论</span>
								<span><i class="fa fa-heart-o" aria-hidden="true"></i> 6喜欢</span><span class="read-all"><a href="">阅读全文</a></span></p>
						</div>
					</div>
				</div>
				<div class="box2-left">
					<div class="box2-left-item">
						<div class="box2-left-item-img">
							<a href=""><img src="./images/li1.png" alt=""></a>
							<span>学习笔记</span>
						</div>
						<div class="box2-left-item-text">
							<p class="text-title">
								<a href="">深度学习实战教程(六)：长短时记忆网络(LSTM)</a>
								</p>
							<p class="text-article">在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。</p>
							<p class="tag">
								<span><i class="fa fa-circle" aria-hidden="true"></i></i> javascript</span>
								<span><i class="fa fa-clock-o" aria-hidden="true"></i> 2019-07-23 15:21</span>
								<span><i class="fa fa-eye" aria-hidden="true"></i> 1314浏览</span>
								<span><i class="fa fa-commenting-o" aria-hidden="true"></i> 520评论</span>
								<span><i class="fa fa-heart-o" aria-hidden="true"></i> 6喜欢</span><span class="read-all"><a href="">阅读全文</a></span></p>
						</div>
					</div>
				</div>
				<div class="box2-left">
					<div class="box2-left-item">
						<div class="box2-left-item-img">
							<a href=""><img src="./images/li1.png" alt=""></a>
							<span>学习笔记</span>
						</div>
						<div class="box2-left-item-text">
							<p class="text-title">
								<a href="">深度学习实战教程(六)：长短时记忆网络(LSTM)</a>
								</p>
							<p class="text-article">在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。在上一篇文章中，我们介绍了循环神经网络以及它的训练算法。我们也介绍了循环神经网络很难训练的原因，这导致了它在实际应用中，很难处理长距离的依赖。</p>
							<p class="tag">
								<span><i class="fa fa-circle" aria-hidden="true"></i></i> javascript</span>
								<span><i class="fa fa-clock-o" aria-hidden="true"></i> 2019-07-23 15:21</span>
								<span><i class="fa fa-eye" aria-hidden="true"></i> 1314浏览</span>
								<span><i class="fa fa-commenting-o" aria-hidden="true"></i> 520评论</span>
								<span><i class="fa fa-heart-o" aria-hidden="true"></i> 6喜欢</span><span class="read-all"><a href="">阅读全文</a></span></p>
						</div>
					</div>
				</div>	
				<!-- 左侧分页栏-->
				<div class="box3-left">
					<div class="box3-left-paging">
						<ul>
							<li><a href="">«</a></li>
							<li><a class="active" href="">1</a></li>
							<li><a href="">2</a></li>
							<li><a href="">...</a></li>
							<li><a href="">6</a></li>
							<li><a href="">7</a></li>
							<li><a href="">»</a></li>
						</ul>
					</div>
				</div>
			</div>
			<!-- 右侧内容区域 -->
			<div class="contain-right">
				<!-- 右侧热门文章 -->
				<div class="box1-right">
					<div class="box1-right-title">
						<p><i class="fa fa-fire pad" aria-hidden="true"></i>热门文章</p>
					</div>
					<div class="box1-right-contain">
						<ul>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
							<li><a href="">爬虫进阶教程：抖音APP无水印视频</a></li>
						</ul>
					</div>
				</div>
				<!-- 右侧关于本站 -->
				<div class="box2-right">
					<div class="box2-right-img">
						<img src="images/lun1.png" alt="背景图片">
					</div>
					<div class="box2-right-head">
						<img src="images/head.jpg" alt="个人头像">
					</div>
					<div class="box2-right-text">
						<h3>本站宗旨</h3>
						<p>把自己的学习笔记、学习平台和心情随笔等记录下来，分享给需要的读者！</p>
					</div>
					<div class="box2-right-item">
						<ul>
							<li><span>文章</span><strong>3</strong></li>
							<li><span>评论</span><strong>2</strong></li>
							<li><span>浏览</span><strong>1314</strong></li>
						</ul>
					</div>
				</div>	
				<!-- 右侧文章归档-->
				<div class="box3-right">
					<div class="box3-right-title">
						<p><i class="fa fa-book pad" aria-hidden="true"></i>文章归档</p>
					</div>	
					<div class="box3-right-contain">
						<ul>
							<li><a href="">2019年7月</a></li>
							<li><a href="">2019年6月</a></li>
							<li><a href="">2019年5月</a></li>
							<li><a href="">2019年4月</a></li>
							<li><a href="">2019年3月</a></li>
							<li><a href="">2019年2月</a></li>
							<li><a href="">2019年1月</a></li>
						</ul>
						<ul>
							<li><a href="">2019年7月</a></li>
							<li><a href="">2019年6月</a></li>
							<li><a href="">2019年5月</a></li>
							<li><a href="">2019年4月</a></li>
							<li><a href="">2019年3月</a></li>
							<li><a href="">2019年2月</a></li>
							<li><a href="">2019年1月</a></li>
						</ul>						
					</div>				
				</div>
				<!-- 右侧热门标签 -->
				<div class="box4-right">
					<div class="box4-right-title">
						<p><i class="fa fa-tags pad" aria-hidden="true"></i>热门标签</p>
					</div>		
					<div class="box4-right-contain">
						<span><a href="">HTML</a></span>
						<span><a href="">CSS</a></span>
						<span><a href="">JavaScript</a></span>
						<span><a href="">jQuery</a></span>
						<span><a href="">Vue</a></span>
						<span><a href="">Angular</a></span>
						<span><a href="">node</a></span>
						<span><a href="">React</a></span>
						<span><a href="">ajax</a></span>
						<span><a href="">python</a></span>
						<span><a href="">Spring</a></span>
						<span><a href="">SpringMVC</a></span>
						<span><a href="">Mybatis</a></span>
						<span><a href="">Springboot</a></span>
					</div>					
				</div>
				<!-- 右侧与我联系 -->
				<div class="box5-right">
					<div class="box5-right-title">
						<p><i class="fa fa-qrcode pad" aria-hidden="true"></i>与我联系</p>
					</div>	
					<div class="box5-right-contain">
						<div class="box5-right-contain-item">
							<img src="images/wei.jpg" alt="微信">
							<p>微信</p>
						</div>
						<div class="box5-right-contain-item">
							<img src="images/qq.jpg" alt="qq">
							<p>QQ</p>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- 底部部分 -->
	<footer>
		<p>Copyright &copy; 2019 <span><a href="http://duli1126.cn">杜丽个人小屋</a></span> All Rights Reserved. 备案号：蜀ICP备19023527号-1<a name="bottom"></a></p>
	</footer>
</body>
</html>